<template>
  <div class="app-container">
    <!-- 患者信息搜索开始 -->
    <el-card class="box-card">
      <el-form ref="queryForm" :model="patientParams" label-width="70px">
        <el-row :gutter="24">
          <el-col :span="12">
            <el-form-item label="身份证号" porp="idCard">
              <el-input
                  v-model="patientParams.idCard"
                  placeholder="请输入患者身份证号"
                  clearable
                  size="small"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item>
              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleIdCardQuery">加载身份证号
              </el-button>
              <el-button type="warning" icon="el-icon-search" size="mini" @click="handleIdCardQuery">加载患者信息
              </el-button>
              <el-button type="normal" icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
              <el-button type="primary" icon="el-icon-refresh" size="mini" @click="shuaxin">刷新页面</el-button>

            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <!-- 患者信息搜索结束 -->


    <!-- 患者基本信息表单开始 -->
    <el-card class="box-card">
      <el-form ref="form" :model="patientParams" :rules="rules" :inline="true" label-width="88px">
        <el-form-item label="身份证号" prop="idCard">
          <el-input
              v-model="patientParams.idCard"
              placeholder="请输身份证号"
              clearable
              size="small"
              style="width:200px"/>
        </el-form-item>
        <el-form-item label="患者姓名" prop="name">
          <el-input
              v-model="patientParams.name"
              placeholder="请输入患者姓名"
              clearable
              size="small"
              style="width:200px"/>
        </el-form-item>
        <el-form-item label="患者电话" prop="phone">
          <el-input
              v-model="patientParams.phone"
              placeholder="请输入患者电话"
              clearable
              size="small"
              style="width:200px"/>
        </el-form-item>
        <el-form-item label="性别" prop="sex" :formatter="dictSexData">
          <el-radio-group v-model="patientParams.sex">
            <el-radio
                v-for="d in sexOptions"
                :key="d.dictValue"
                :label="d.dictValue"
                :value="d.dictValue">{{ d.dictLabel }}
            </el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="出生日期" prop="birthday">
          <el-date-picker
              v-model="patientParams.birthday"
              size="small"
              style="width:200px"
              value-format="yyyy-MM-dd"
              type="date"/>
        </el-form-item>
        <el-form-item label="患者年龄" prop="age">
          <el-input
              v-model="patientParams.age"
              :readonly="true"
              placeholder="请输入患者年龄"
              clearable
              size="small"
              style="width:200px"/>
        </el-form-item>
        <el-form-item label="地址信息" prop="address">
          <el-input
              v-model="patientParams.address"
              placeholder="请输入地址信息"
              clearable
              style="width:500px"
              size="small"/>
        </el-form-item>
      </el-form>
    </el-card>
    <!-- 患者基本信息表单结束 -->


    <!-- 挂号项目栏开始 -->
    <el-card class="box-card">
      <el-row>
        <el-col :span="12">
          <el-radio-group v-model="queryDeptParams.regItemId" @change="registeredItemChange">
            <el-radio-button
                v-for="d in regItemOptions"
                :key="d.regItemId"
                :label="d.regItemId"
                :value="d.regItemId">{{ d.regItemName }}
            </el-radio-button>
          </el-radio-group>
        </el-col>
        <el-col :span="12">
          <div style="float:right">
            <span style="margin-left:20px;font-weight: bold;font-size: 14px">挂号费:￥{{ queryDeptParams.regItemAmount }}&nbsp;&nbsp;</span>
            <el-button type="danger" icon="el-icon-search" :disabled="single" size="small" @click="handleRegistration">
              挂号收费
            </el-button>
          </div>
        </el-col>
      </el-row>
    </el-card>
    <!-- 挂号项目栏结束 -->


    <el-card>
      <el-form ref="queryDeptForm" :model="queryDeptParams" :inline="true" label-width="68px">
        <el-form-item label="所属科室" prop="deptId">
          <el-select
              v-model="queryDeptParams.deptId"
              placeholder="请选择所属科室"
              clearable
              size="small"
              style="width:200px">
            <el-option
                v-for="d in deptOptions"
                :key="d.deptId"
                :label="d.deptName"
                :value="d.deptId"/>
          </el-select>
        </el-form-item>
        <el-form-item label="挂号类型" prop="schedulingType" :formatter="schedulingTypeFormatter">
          <el-select
              v-model="queryDeptParams.schedulingType"
              placeholder="请选择挂号类型"
              clearable
              size="small"
              style="width:200px">
            <el-option
                v-for="dict in schedulingTypeOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"/>
          </el-select>
        </el-form-item>
        <el-form-item label="挂号时段" prop="subsectionType" :formatter="subsectionDayFormatter">
          <el-select
              v-model="queryDeptParams.subsectionType"
              placeholder="请选择挂号时段"
              clearable
              size="small"
              style="width:200px">
            <el-option
                v-for="dict in subsectionTypeOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="dict.dictValue"/>
          </el-select>
        </el-form-item>
        <el-form-item label="挂号时间" prop="schedulingDay">
          <el-date-picker
              v-model="queryDeptParams.schedulingDay"
              size="small"
              style="width:240px"
              value-format="yyyy-MM-dd"
              type="date"/>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleDeptQuery">搜索</el-button>
          <el-button type="primary" icon="el-icon-refresh" size="mini" @click="resetDeptQuery">重置</el-button>
        </el-form-item>
      </el-form>
      <!-- 部门数据表格开始 -->
      <el-table border :data="deptTableList" highlight-current-row
                @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" align="center"/>
        <el-table-column label="科室ID" align="center" prop="deptId"/>
        <el-table-column label="科室名称" align="center" prop="deptName"/>
        <el-table-column label="当前号数" align="center" prop="regNumber"/>
      </el-table>
      <!-- 部门数据表格结束 -->
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {/*
      // 遮罩层
      loading: false,*/
      // 患者信息查询参数
      patientParams: {
        idCard: "42108719900103451X",
        name: undefined,
        phone: undefined,
        sex: undefined,
        birthday: undefined,
        age: undefined,
        address:undefined
      },
      // 表单校验
      rules: {
        name: [
          {required: true, message: '患者姓名不能为空', trigger: 'blur'}
        ],
        phone: [
          {required: true, message: '手机号不能为空', trigger: 'blur'},
          {pattern: /^1[3|4|5|7|8|9][0-9]\d{8}$/, message: '请输入正确的手机号', trigger: 'blur'}
        ],
        idCard: [
          {required: true, message: '身份证号不能为空', trigger: 'blur'}
        ]
      },
      // 性别数据字典
      sexOptions: [],
      // 有号部门的查询条件
      queryDeptParams: {
        deptId: undefined,
        schedulingType: '1',
        subsectionType: '1',
        // schedulingDay: new Date(),
        regItemId: 1,
        regItemAmount: undefined
      },
      regItemAmount: undefined,
      // 非单个禁用
      single: true,
      // 挂号项目
      regItemOptions: [],
      deptOptions: [],
      // 挂号类型
      schedulingTypeOptions: [],
      // 排班时段
      subsectionTypeOptions: [],
      // 部门数据
      deptTableList: []
    }
  },
  created() {
    this.init();
    // 翻译性别
    this.getDictDataSex();
    //加载部门信息
    this.getDeptMsg();
    // 加载挂号类型
    this.getSchedulingTypeMsg();
    //翻译挂号类型
    this.getDictDataSchedulingType();
    //加载挂号时段
    this.getSubsectionDay();
    //翻译挂号时段
    this.getDictDataSubsectionDay();
  },

  methods: {
    // 加载用户性别
    getDictDataSex(){
      this.$http.get("/hisRemoteDictData/queryByDictType/sys_user_sex").then(res=>{
        this.sexOptions = res.data
      })
    },
    dictSexData(row){
      let sexLabel;
      this.sexOptions.filter(item => {
        if (parseInt(item.dictValue) === parseInt(row.patientParams.sex)) {
          sexLabel = item.dictLabel
        }
      })
      return sexLabel;
    },
    // 进行初始化
    init() {
      // 查询挂号项目--急诊、门诊、急诊+病例表、门诊+病例表
      this.$http.get("/hisRemoteDictData/getAllRegisteredItem").then(res => {
        //console.log(res.data.data)
        this.regItemOptions = res.data
        this.queryDeptParams.regItemId = this.regItemOptions[0].regItemId
        this.queryDeptParams.regItemAmount = this.regItemOptions[0].regItemFee
      })
      //this.getDeptForScheduling();
    },
    // 更新挂号项目--挂号项目选择时触发，显示挂号项目金额
    registeredItemChange(id) {
      this.regItemOptions.filter(item => {
        if (id === item.regItemId) {
          this.queryDeptParams.regItemId = item.regItemId
          this.queryDeptParams.regItemAmount = item.regItemFee
        }
      })
      // 动态显示挂号信息
      if (id === 1 || id === 2) {
        this.queryDeptParams.schedulingType = '1'
      } else {
        this.queryDeptParams.schedulingType = '2'
      }
      // 重新查询有号的部门
     // this.getDeptForScheduling()
      // 重新加载翻译挂号类型
      this.getDictDataSchedulingType()
      // 重新加载挂号时段
      this.getDictDataSubsectionDay();
    },
    // 加载身份证号码
    // 根据输入的身份证号加载患者数据
    handleIdCardQuery() {
      this.loading = true;
      if (this.patientParams.idCard ===undefined){
        this.$message.warning("请输入要查询的身份证号");
        return;
      }
      this.$http.get("/patient/getByIdCard/"+this.patientParams.idCard).then(res => {
        //console.log(res.data.data)
        this.patientParams=res.data.data
      })
    },
    // 查询
    handleDeptQuery() {
      this.getDeptForScheduling()
    },
    // 查询可挂号的信息--值班情况查询
    //
    /*:
    deptId:103                  科室ID
    regItemAmount:13            收费金额
    regItemId:4                  挂号项目ID
    schedulingDay:Sat Jan 11 2025 11:49:34 GMT+0800 (中国标准时间)
    schedulingType:"2"            scheduling_type 排班类型1 门诊 2 急诊
    subsectionType:"1"            subsection_type 排班时段1上午  2下午 3晚上
    */
    getDeptForScheduling() {
      if (!this.queryDeptParams.subsectionType) {
        this.$message.error("请选择挂号时段");
        return;
      }
      // console.log(this.queryDeptParams)   scheduling
      this.$http.post("/hisScheduling/queryByEntity",this.queryDeptParams).then(res => {
        //console.log(res.data.data)
        if (res.data.code === 200) {
          this.deptTableList = res.data.data
        } else {
          this.$message.error("查询失败")
        }
      });
    },
    // 1.查询所有  科室的信息
    getDeptMsg(){
      this.$http.get("/hisRemoteDictData/getAllDept").then(res => {
        this.deptOptions = res.data.data
      })
    },
    //2.查询挂号类型
    getSchedulingTypeMsg(){
      this.$http.get("/hisRemoteDictData/queryByDictType/his_scheduling_type").then(res => {
        //console.log(res.data.data)
        this.schedulingTypeOptions = res.data
      })
    },
      //翻译
    getDictDataSchedulingType(){
      this.$http.get("/hisRemoteDictData/queryByDictType/his_scheduling_type").then(res=>{
        this.schedulingTypeOptions = res.data
      })
    },
    schedulingTypeFormatter(row, column) {
      let schedulingTypeLabel;
      this.schedulingTypeOptions.filter(item => {
        if (parseInt(item.dictValue) === parseInt(row.schedulingType)) {
          schedulingTypeLabel = item.dictLabel
        }
      })
      return schedulingTypeLabel;
    },
    //3.查询挂号时段
    getSubsectionDay(){
      this.$http.get("/hisRemoteDictData/queryByDictType/his_subsection_type").then(res => {
        //console.log(res.data.data)
        this.subsectionTypeOptions = res.data
      })
    }, //翻译
    getDictDataSubsectionDay(){
      this.$http.get("/hisRemoteDictData/queryByDictType/his_subsection_type").then(res=>{
        this.subsectionTypeOptions = res.data
      })
    },
    subsectionDayFormatter(row, column) {
      let subsectionDayLabel;
      this.subsectionTypeOptions.filter(item => {
        if (parseInt(item.dictValue) === parseInt(row.subsectionType)) {
          subsectionDayLabel = item.dictLabel
        }
      })
      return subsectionDayLabel;
    },

    // 重置
    resetDeptQuery() {
      this.getDeptForScheduling()
      this.queryDeptParams = {
        deptId: undefined,
        schedulingType: '1',
        subsectionType: '1',
        regItemId: 1,
        regItemAmount: undefined
      }
    },
    //刷新
    shuaxin(){
      location.reload()
    },
    // 表格选中行事件
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.deptId)
      this.single = selection.length !== 1
    },

    // 挂号收费
    handleRegistration() {
      this.$refs['form'].validate(vaild => {
        if (vaild) {
          this.$confirm('是否确认给【' + this.patientParams.name + '】进行挂号?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            closeOnClickModal: false,
            type: 'waring',
            center: true
          }).then(() => {
            // 取出要挂号的部门
            const deptId = this.ids[0]
            // 组装要提交到后台的挂号数据
            const data = {
              // 患者信息
              'patientDto': this.patientParams,
              // 挂号信息
              'registrationDto': {
                deptId: deptId,
                registrationItemId: this.queryDeptParams.regItemId,
                registrationAmount: this.queryDeptParams.regItemAmount,
                visitDate: this.moment(this.queryDeptParams.schedulingDay).format('YYYY-MM-DD'),
                schedulingType: this.queryDeptParams.schedulingType,
                subsectionType: this.queryDeptParams.subsectionType
              }
            }
            console.log(data)
            //提交数据给后台
            this.$http.post("/hisRegistration/addRegistration", data).then(res => {
              // console.log(res.data)
              if (res.data.code === 200){
                // console.log(res)
                let regId = res.data.data
                // console.log(regId)
                this.$message.success('挂号成功 挂号单号为【' + regId + '】')
                // 清空页面上的数据
                this.resetDeptQuery()
                this.resetQuery();

                /*this.$confirm('是否确认给挂号ID为【' + regId + '】的挂号收费?', '提示', {
                  confirmButtonText: '确定',
                  cancelButtonText: '取消',
                  closeOnClickModal: false,
                  type: 'waring',
                  center: true
                }).then(() => {
                  //console.log(regId)
                  this.$http.get("/hisRegistration/updateStatus/"+regId+"/"+"1").then(res => {
                    //console.log(res.data.msg)
                    if (res.data.code === 200){
                      this.$message.success('挂号收费成功')
                      //重新加载
                      this.resetDeptQuery();
                      this.resetQuery();
                    }
                  }).catch(()=>{
                    this.$message.error('挂号收费失败')
                  })
                }).catch(()=>{
                  this.$message.warning('挂号收费取消')
                })*/


              }else {
                this.$message.error('挂号失败,请选择具体时间')
              }
            }).catch(()=>{
              this.$message.error('挂号失败')
            })
          }).catch(()=>{
            this.$message.warning('挂号已取消')
          })
        }
      })
    },
    // 重置查询条件
    resetQuery(){
      this.patientParams = {}
    }
  }
}
</script>

<style>

</style>
